import { createRouter, createWebHashHistory } from 'vue-router'

import Layout from "@/layout/index.vue";
/**
 * layout.children中的参数设置
 * path                        // layout中的组件如果父组件不是layout，path值就必须是父组件path+自己的path。
 *                             // 例如:/test/a。用于扁平化路由后生成原来的路由结构，生产菜单（扁平化是解决keep-alive多层嵌套路由不生效的解决方案）。
 * meta:{
 *  title                      // 侧边栏和面包屑中展示的名字
 *  icon                       // 菜单栏的图标（element-plus icon名称）
 *  affix                      // 是否可以关闭（true为不能关闭）
 *  keepAlive                  // 是否为keepAlive缓存页面(必须在setup后边添加name='**')
 *  notMenu                    // 如果设置为true，则不会在侧边栏菜单中显示
 *  notBreadcrumb: true        // 如果设置为true，则不会在顶部面包屑中显示
 * }
 */
const routes = [
  // 默认路由
  {
    name: 'layout',
    path: '',
    component: Layout,
    redirect: 'home',
    meta: {
      notBreadcrumb: true
    },
    children: [
      {
        name: 'home',
        path: '/home',
        component: () => import('@/view/home/index.vue'),
        meta: { title: '首页', icon: 'House', affix: true, keepAlive: true }
      }
    ]
  },
  {
    name: 'login',
    path: '/login',
    component: () => import('@/view/login/index.vue'), // 注意这里要带上 文件后缀.vue
    meta: {
      notBreadcrumb: true
    }
  },
  {
    path: '/:pathMatch(.*)*',
    component: Layout,
    redirect: '404',
    meta: {
      notBreadcrumb: true
    },
    children: [
      {
        name: '404',
        path: '',
        component: () => import('@/view/error/404.vue'),
        meta: {
          notBreadcrumb: true
        }
      }
    ]
  },
]
const router = createRouter({
  history: createWebHashHistory(),
  routes,
})
export default router
